<!-- 助教详情 -->
<template>
    <view class="teach-details">
        <!-- 新增课程卡片列表 -->
        <view class="course-list">
            <view class="course-card" v-for="item in courseList" :key="item.id">
                <view class="course-title">{{item.tableName}}</view>
                <view class="course-info-row">
                    <text>开始时间</text>
                    <text>{{item.startTime}}</text>
                </view>
                <view class="course-info-row">
                    <text>结束时间</text>
                    <text>{{item.endTime}}</text>
                </view>
                <view class="course-info-row">
                    <text>上课时长</text>
                    <text>{{item.classTime}}小时</text>
                </view>
                <view class="course-info-row">
                    <text>补时时长</text>
                    <text>{{item.editTime}}分钟</text>
                </view>
                <view class="course-info-row">
                    <text>买课时长</text>
                    <text>{{item.payTime}}小时</text>
                </view>
                <view class="course-total">
                    总金额 ￥<text class="course-total-amount">{{item.amount}}</text>
                </view>
            </view>
        </view>
    </view>
</template>

<script setup>
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { getCurrentTutorOrderList } from '@/api/dataCenter/index'
const tutorId = ref('')
const dateTime = ref('')
const startDate = ref('')
const endDate = ref('')
const courseList = ref([])
onLoad((option)=>{
    tutorId.value = option.tutorId
    dateTime.value = option.dateTime
    console.log(dateTime.value)
    const {start,end} = getDate(dateTime.value)
    startDate.value = start
    endDate.value = end
    console.log(startDate.value,endDate.value)
    getCurrentTutorOrderList({
        tutorId:tutorId.value,
        startTime:startDate.value,
        endTime:endDate.value
    }).then(res=>{
        console.log(res)
        courseList.value = res.result
         //获取总金额
        let totalAmount = 0
        courseList.value.forEach(item=>{
            totalAmount += item.amount
        })
        console.log('总金额：'+totalAmount)
    })
   

})

//拿到一个日期2025-06-15 00:00:00，获取当天到明天凌晨，返回还是这样的格式
const getDate = (date) => {
    // 创建日期对象
    const dateObj = new Date(date)
    
    // 设置开始时间为当天 00:00:00
    const start = new Date(dateObj)
    start.setHours(0, 0, 0, 0)
    
    // 设置结束时间为次日 00:00:00
    const end = new Date(dateObj)
    end.setDate(end.getDate() + 1)
    end.setHours(0, 0, 0, 0)
    
    // 格式化日期为 YYYY-MM-DD HH:mm:ss
    const formatDate = (date) => {
        const year = date.getFullYear()
        const month = String(date.getMonth() + 1).padStart(2, '0')
        const day = String(date.getDate()).padStart(2, '0')
        const hours = String(date.getHours()).padStart(2, '0')
        const minutes = String(date.getMinutes()).padStart(2, '0')
        const seconds = String(date.getSeconds()).padStart(2, '0')
        return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
    }
    
    // 返回格式化后的日期字符串
    return {
        start: formatDate(start),
        end: formatDate(end)
    }
}

</script>

<style scoped lang="scss">
.teach-details {
    padding: 24rpx;
    background: #f5f6fa;
    min-height: 100vh;
}
.teach-details-header {
    margin-bottom: 24rpx;
}
.teach-details-header-title {
    font-size: 36rpx;
    font-weight: bold;
    color: #222;
}
.course-list {
    display: flex;
    flex-direction: column;
    gap: 24rpx;
}
.course-card {
    background: #fff;
    border-radius: 16rpx;
    box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.04);
    padding: 32rpx 24rpx;
}
.course-title {
    font-size: 30rpx;
    font-weight: bold;
    margin-bottom: 16rpx;
    color: #333;
}
.course-info-row {
    display: flex;
    justify-content: space-between;
    font-size: 26rpx;
    color: #666;
    line-height: 60rpx;
    text{
        color: #666;
    }
    text:last-child{
        color: black;
    }
}



.course-total {
    text-align: right;
    font-size: 28rpx;
    color: #222;
    margin-top: 16rpx;
}
.course-total-amount {
    color: #001C71;
    font-weight: bold;
    font-size: 32rpx;
}
</style>
